import React, { Component } from 'react';
import { View, Text, StyleSheet, Image, TouchableOpacity } from 'react-native';
// import { Text16, Text14, Paragraph } from '../component/Text'

export default class LeftItemCell extends Component {

    render() {
        let icon = null;
        if (this.props.image) {
            icon = <Image style={styles.icon} source={this.props.image} />
        }
        let arrowIcon = null;
        if (this.props.arrowImage) {
            arrowIcon = <Image style={styles.arrow} source={this.props.arrowImage} />
        }


        return (
            <View style={styles.container}>

                <View style={[styles.content, this.props.style]}>
                    {icon}
                    <Text style={styles.titleStyle}>{this.props.title}</Text>
                    <View style={{flex:1,backgroundColor:'white'}} />
                    <Text style={{color:'#909090',fontSize:15}}>{this.props.subtitle}</Text>
                    <Image style={styles.arrow} source={require('../../images/other/arrow.png')} />
                </View>

            </View>
        );
    }
}

const styles = StyleSheet.create({
    container: {
        backgroundColor: 'white',
    },
    content: {
        height:0.56*90,
        flexDirection:'row',
        alignItems:'center',
        // paddingLeft:15,
        paddingRight:0.56*32,
    },
    titleStyle:{
        fontSize:14,
        color:'#333333',
        marginLeft:15,
    },
    icon: {
        width:25,
        height:25,
        marginRight:10,
    },
    arrow: {
        width:12,
        height:12,
        marginLeft:5,
    }
});
